<template>
  <div class="area-search">
    <div @click="unify" class="unify">
      <b
        :style="{
          color: cutpage == false ? '#42b1a6' : '#b1b1b1',
          borderBottom: cutpage == false ? 'solid 2px #42b1a6' : ''
        }"
      >
        统一权限调整
      </b>
    </div>
    <div @click="specific" class="unify">
      <b
        :style="{
          color: cutpage == true ? '#42b1a6' : '#b1b1b1',
          borderBottom: cutpage == true ? 'solid 2px #42b1a6' : ''
        }"
        >特定用户调整
      </b>
    </div>
  </div>
  <div class="main-box" style="height: 92%">
    <div class="card" v-show="cutpage == false" style="width: 15%; min-width: 130px; margin-right: 10px; background-color: white">
      <el-scrollbar style="height: calc(100% - 5px)">
        <div style="margin-bottom: 100px" class="dragcontainer">
          <p
            v-for="item in GetSelJueSeAll"
            :key="item"
            :class="{ highlight: item.JueSeID == JueSeID }"
            class="scrollbar-demo-item move"
            @click="tabcutjurisdiction(item)"
          >
            {{ item.JueSeMingCheng }}
          </p>
        </div>

        <div class="operation">
          <div @click="addrole">新增</div>
          &nbsp;
          <div @click="modification">修改</div>
          &nbsp;
          <div @click="delets">删除</div>
        </div>
      </el-scrollbar>
    </div>

    <div class="Roleusermanagement" style="width: 65%; min-width: 180px">
      <!-- :data="GetSelYongHu.listxt_UserTable" specificuser.length-->
      <ProTable
        ref="proTable"
        :row-key="row => row.UserID"
        :request-api="GetSelQuanXianport"
        :request-auto="false"
        :publicsb="Roleusermanagement"
        :columns="columns"
        :data="cutpage == false ? GetSelYongHu.xt_UserTable : specificuser"
        :showhidden="showhidden"
        :init-param="initParam"
        :search-col="{ xs: 1, sm: 1, md: 2, lg: 3, xl: 3 }"
        @darg-sort="dargSort"
      >
        <!-- 表格 header 按钮 -->
        <template #tableHeader>
          <el-button type="primary" :icon="CirclePlus" v-if="cutpage == false" @click="addusername">新增用户</el-button>
          <div v-else style="display: flex">
            <div><el-input v-model="searchoneuser"></el-input></div>
            &nbsp;&nbsp;&nbsp;
            <div><el-button @click="serchoneuser" type="primary">查询</el-button></div>
          </div>
        </template>
        <!-- 表格操作 -->
        <template #operation="scope">
          <el-tooltip class="box-item" effect="dark" content="编辑" placement="top">
            <el-button type="primary" link :icon="EditPen" @click="compileuser(scope.row)"></el-button>
          </el-tooltip>

          <el-tooltip class="box-item" effect="dark" content="删除" placement="top">
            <el-button type="primary" link :icon="Delete" @click="deleteAccount(scope.row)"></el-button>
          </el-tooltip>

          <el-tooltip class="box-item" effect="dark" content="解锁" placement="top">
            <el-button type="primary" link :icon="Unlock" @click="unlocks(scope.row)"></el-button>
          </el-tooltip>

          <el-button v-if="cutpage == true" type="primary" link :icon="Minus" @click="removeuser(scope.row)">移除</el-button>
        </template>
      </ProTable>
      <UserDrawer ref="drawerRef" />
      <ImportExcel ref="dialogRef" />
    </div>
    <div class="jurisdiction" style="width: 20%; min-width: 230px">
      <div class="jurisdictionhead">
        <el-select v-model="defaultpermission" class="m-2" @change="changejurisdiction">
          <el-option v-for="item in jurisdiction" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </div>
      <div class="jurisdictionbody">
        <el-tree
          v-if="centerDialogVisible"
          :data="atpresentjurisdiction"
          show-checkbox
          node-key="strCode"
          default-expand-all
          @check-change="treeClick"
          :default-checked-keys="HuiXianlist"
          :props="defaultProps"
          :check-strictly="true"
        />
      </div>
      <div class="jurisdictionleg">
        <el-tooltip class="box-item" effect="dark" content="保存" placement="top-start" v-if="cutpage == false">
          <el-button @click="savejurisdiction" :icon="MessageBox"></el-button>
        </el-tooltip>

        <el-tooltip class="box-item" effect="dark" content="批量保存权限" placement="top-start" v-if="cutpage == true">
          <el-button @click="savepersonagejurisdiction" :icon="MessageBox"></el-button>
        </el-tooltip>

        <el-tooltip class="box-item" effect="dark" content="批量删除权限" placement="top-start" v-if="cutpage == true">
          <el-button @click="deletepersonagejurisdiction" :icon="Delete"></el-button>
        </el-tooltip>

        <el-tooltip class="box-item" effect="dark" content="全选" placement="top-start">
          <el-button @click="quanxuan" :icon="Select"></el-button>
        </el-tooltip>

        <el-tooltip class="box-item" effect="dark" content="清除" placement="top-start">
          <el-button @click="quxiaoquanxuan" :icon="SemiSelect"></el-button>
        </el-tooltip>
      </div>
    </div>
  </div>
  <sonfunction
    ref="sonclear"
    :addusershow="addusershow"
    :adduser="adduser"
    @succeedwin="succeedwin"
    :jueseid="JueSeID"
    @distancecancel="distancecancel"
    :edittapevalues="edittapevalues"
  ></sonfunction>
</template>
<script setup lang="ts" name="useTreeFilter">
import { ref, reactive, onMounted, nextTick } from "vue";
import { User } from "@/api/interface";
import Sortable from "sortablejs";
import sonfunction from "./components/indexson.vue";
import { useHandleData } from "@/hooks/useHandleData";
import ProTable from "@/components/tablepublic/index.vue";
import ImportExcel from "@/components/ImportExcel/index.vue";
import UserDrawer from "@/views/proTable/components/UserDrawer.vue";
import { ProTableInstance, ColumnProps } from "@/components/ProTable/interface";
import { CirclePlus, Delete, EditPen, Minus, MessageBox, Select, SemiSelect, Unlock } from "@element-plus/icons-vue";
import {
  GetSelYongHuport,
  GetSelJueSeAllport,
  GetSelQuanXianport,
  PostJueSeAddport,
  PostJueSeUpdateport,
  PostJueSeDeleteport,
  DeleteUserDeleteport,
  PutJieChuSuoDingport,
  PostSaveJuSeQuanXianport,
  GetSelUserport,
  PostUserZhuiJiaQuanXianport,
  PutUserJueSeTiaoZhengShunXuport
} from "@/api/modules/user";
import { ElMessage, ElMessageBox } from "element-plus";
// getUserDepartment
const searchoneuser = ref<string>("");
const addusershow = ref<any>(false);
// 储存特定用户
const specificuser = ref<any>([]);
// 储存全部权限
const GetSelQuanXian = ref<any>();
const Roleusermanagement = ref("Roleusermanagement");
const iShunXu = ref<any>();
// 菜单权限
const defaultProps = ref<any>({
  children: "children",
  label: "strName",
  value: "strCode"
});
const sonclear = ref<any>();
const edittapevalues = ref<any>({});
const pdone = ref<number>(null);
// 默认权限
const defaultpermission = ref<string>("院区权限");
const jurisdiction = [
  {
    value: "院区权限",
    label: "院区权限"
  },
  {
    value: "菜单权限",
    label: "菜单权限"
  },
  {
    value: "申请单权限",
    label: "申请单权限"
  },
  {
    value: "报表权限",
    label: "报表权限"
  }
];
const bjjuese = ref<string>();
// 判断显示隐藏
const cutpage = ref<boolean>(false);
const centerDialogVisible = ref(false);
// 控制分页显示隐藏
const showhidden = ref<boolean>(false);
//存储所有的角色
const GetSelJueSeAll = ref<any>([]);
const JueSeID = ref<string>();
// 储存全部用户和角色权限
const GetSelYongHu = ref<any>([]);
// 储存当前权限
const atpresentjurisdiction = ref<any>([]);
// 回显数组
const HuiXianlist = ref<any>([]);
const adduser = ref("新增用户");
// 添加需要的权限
const alasArray = ref<any>([]);

// 院区回显
const anniversaryecho = () => {
  HuiXianlist.value = [];
  atpresentjurisdiction.value.forEach((i: any) => {
    GetSelYongHu.value.listYuanQu?.forEach((YQ: any) => {
      treeClick(YQ, true);
      if (i.strCode == YQ.strCode) {
        HuiXianlist.value.push(YQ.strCode);
      }
    });
  });
};

// 菜单回显
const scriptinglanguage = () => {
  atpresentjurisdiction.value.forEach((i: any) => {
    console.log(i, "iiiiiiiiiiiiiiii");
    GetSelYongHu.value.listCaiDan?.forEach((CD: any) => {
      treeClick(CD, true);
      if (i.strCode == CD.strCode) {
        HuiXianlist.value.push(CD.strCode);
      }
      if (i.children && i.children.length > 0 && CD.children && CD.children.length > 0) {
        i.children.forEach((ison: any) => {
          CD.children.forEach((CDson: any) => {
            treeClick(CDson, true);
            if (ison.strCode == CDson.strCode) {
              HuiXianlist.value.push(CDson.strCode);
            }
          });
        });
      }
    });
  });
};

// 申请单回显
const applyforoneecho = () => {
  atpresentjurisdiction.value.forEach((i: any) => {
    GetSelYongHu.value.listShenQingDan?.forEach((SQD: any) => {
      treeClick(SQD, true);
      if (i.strCode == SQD.strCode) {
        HuiXianlist.value.push(SQD.strCode);
      }
      if (SQD.children && SQD.children.length > 0 && i.children && i.children.length > 0) {
        SQD.children.forEach((ison: any) => {
          treeClick(ison, true);
          i.children.forEach(SQDson => {
            if (ison.strCode == SQDson.strCode) {
              HuiXianlist.value.push(SQDson.strCode);
            }
          });
        });
      }
    });
  });
};

// 报表回显
const statementecho = () => {
  atpresentjurisdiction.value.forEach((i: any) => {
    GetSelYongHu.value.listBaoBiao?.forEach((BB: any) => {
      treeClick(BB, true);
      if (i.strCode == BB.strCode) {
        HuiXianlist.value.push(BB.strCode);
      }
      if (i.children && i.children.length > 0 && BB.children && BB.children.length > 0) {
        i.children.forEach((ison: any) => {
          BB.children.forEach((BBson: any) => {
            treeClick(BBson, true);
            if (ison.strCode == BBson.strCode) {
              HuiXianlist.value.push(BBson.strCode);
            }
          });
        });
      }
    });
  });
};
// 选中取消tree
const treeClick = (data: any, e: any) => {
  const { strCode } = data;
  if (e === true) {
    if (!alasArray.value.includes(strCode)) {
      alasArray.value.push(strCode);
    }
  } else {
    const index = alasArray.value.indexOf(strCode);
    if (index != -1) {
      alasArray.value.splice(index, 1);
    }
  }
  console.log(alasArray.value);
};

const tabcutjurisdiction = (item: any) => {
  iShunXu.value = item.ShunXu;
  alasArray.value = [];
  centerDialogVisible.value = false;
  bjjuese.value = item.JueSeMingCheng;
  JueSeID.value = item.JueSeID;
  defaultpermission.value = "院区权限";
  atpresentjurisdiction.value = GetSelQuanXian.value.listYuanQuClass;
  userinquire();
  console.log(HuiXianlist.value);
};
const operate = ref<string>("");

// ProTable 实例
const proTable = ref<ProTableInstance>();

// 如果表格需要初始化请求参数，直接定义传给 ProTable(之后每次请求都会自动带上该参数，此参数更改之后也会一直带上，改变此参数会自动刷新表格数据)
const initParam = reactive({ departmentId: "1" });

// 权限切换
const changejurisdiction = () => {
  HuiXianlist.value = [];
  alasArray.value = [];
  console.log(defaultpermission.value);
  console.log(GetSelQuanXian.value);
  if (defaultpermission.value == "菜单权限") {
    atpresentjurisdiction.value = GetSelQuanXian.value.listCaiDanQuanXianDataClass;
    scriptinglanguage();
  } else if (defaultpermission.value == "申请单权限") {
    atpresentjurisdiction.value = GetSelQuanXian.value.listShenQingDanQuanXianDataClass;
    applyforoneecho();
  } else if (defaultpermission.value == "报表权限") {
    atpresentjurisdiction.value = GetSelQuanXian.value.listBaoBiaoQuanXianDataClass;
    statementecho();
  } else if (defaultpermission.value == "院区权限") {
    atpresentjurisdiction.value = GetSelQuanXian.value.listYuanQuClass;
    anniversaryecho();
  }
};

// 表格配置项
const columns = reactive<ColumnProps<User.ResUserList>[]>([
  { prop: "ShunXu", label: "序号", width: 80 },
  {
    // 加上 sort 就获取不到当前行的数据
    type: "sort",
    label: "排序",
    width: 80,
    prop: "UserID"
  },
  { prop: "uCode", label: "用户代码", search: { el: "input" } },
  { prop: "JueSeMingCheng", label: "角色名称", search: { el: "input" } },
  {
    prop: "uName",
    label: "用户名称",
    fieldNames: { label: "genderLabel", value: "genderValue" }
  },
  { prop: "uPY", label: "拼音码" },
  { prop: "BeiZhu", label: "备注" },
  { prop: "operation", label: "操作", width: 250, fixed: "right" }
]);

const quanxuan = () => {
  centerDialogVisible.value = false;
  atpresentjurisdiction.value.forEach((item: any) => {
    treeClick(item, true);
    HuiXianlist.value.push(item.strCode);
    if (item.children && item.children != 0) {
      item.children.forEach(itemson => {
        treeClick(itemson, true);
        HuiXianlist.value.push(itemson.strCode);
      });
    }
  });
  nextTick(() => {
    centerDialogVisible.value = true;
  });
};

const quxiaoquanxuan = () => {
  HuiXianlist.value = [];
  alasArray.value = [];
  centerDialogVisible.value = false;
  atpresentjurisdiction.value.forEach((item: any) => {
    console.log(item);
    treeClick(item, false);
    HuiXianlist.value = [];
    if (item.children && item.children != 0) {
      treeClick(item, false);
      HuiXianlist.value = [];
    }
  });
  nextTick(() => {
    centerDialogVisible.value = true;
  });
  console.log(HuiXianlist.value, alasArray.value);
};
const immediately = () => {
  // 查询全部权限
  GetSelQuanXianport().then((res: any) => {
    GetSelQuanXian.value = res.Data;
    atpresentjurisdiction.value = res.Data.listYuanQuClass ? res.Data.listYuanQuClass : [];
    console.log(atpresentjurisdiction.value, "atpresentjurisdictionatpresentjurisdiction");
    order();
  });
};

const succeedwin = () => {
  userinquire();
};

// 查询全部角色
const order = () => {
  GetSelJueSeAllport().then((res: any) => {
    if (res.Success == 0) {
      console.log(res);
      GetSelJueSeAll.value = res.Data;
      // if (pdone.value == 1) {
      //   console.log(pdone.value, "------------------------");

      //   iShunXu.value = res.Data[0] ? res.Data[0].ShunXu : "";
      //   JueSeID.value = res.Data[0] ? res.Data[0].JueSeID : "";
      //   bjjuese.value = res.Data[0] ? res.Data[0].JueSeMingCheng : "";
      // }
      if (!pdone.value) {
        iShunXu.value = res.Data[0] ? res.Data[0].ShunXu : "";
        JueSeID.value = res.Data[0] ? res.Data[0].JueSeID : "";
        bjjuese.value = res.Data[0] ? res.Data[0].JueSeMingCheng : "";
      }

      // pdone.value = 1;
      userinquire();
    }
  });
};

const compileuser = (row: any) => {
  console.log(row);

  addusershow.value = true;
  adduser.value = "编辑用户";
  edittapevalues.value = row;
  console.log(edittapevalues.value);
};

// 根据角色ID查询用户
const userinquire = () => {
  const data = {
    strJuseId: JueSeID.value
  };
  GetSelYongHuport(data).then((res: any) => {
    console.log(res);
    if (res.Success == 0) {
      GetSelYongHu.value = res.Data;
      anniversaryecho();
      nextTick(() => {
        centerDialogVisible.value = true;
      });
      res.Data.listYuanQu.forEach(item => {
        treeClick(item, true);
      });
    }
  });
};

//拖拽函数
const positivesequence = (which, item, index, different) => {
  const data = {
    strType: which,
    strJuseId: item.JueSeID,
    strUserId: different ? different : "",
    iTiaoZhengQianShunXu: item.ShunXu,
    iTiaoZhengHouShunXu: index
  };
  console.log(data);
  PutUserJueSeTiaoZhengShunXuport(data).then((res: any) => {
    console.log(res);
    pdone.value = 2;
    if (res.Success == 0) {
      order();
    }
  });
};

// 用户拖拽
const dargSort = (item: any) => {
  console.log(item);

  positivesequence("用户", item.removedItem, item.newIndex + 1, item.removedItem.UserID);
};

// 拖拽排序
const dragSort = () => {
  const tbody = document.querySelector(".el-scrollbar .dragcontainer") as HTMLElement;
  console.log(tbody);

  Sortable.create(tbody, {
    handle: ".move",
    // handle: ".drag-btn",
    animation: 300,
    onEnd({ newIndex, oldIndex }: any) {
      const [removedItem] = GetSelJueSeAll.value.splice(oldIndex!, 1);
      GetSelJueSeAll.value.splice(newIndex!, 0, removedItem);
      pdone.value = 2;

      positivesequence("角色", removedItem, newIndex + 1, false);
    }
  });
};

onMounted(() => {
  immediately();
  dragSort();
});

// 新增用户
const addusername = () => {
  sonclear.value.ex();
  sonclear.value.edittapevalue = null;
  addusershow.value = true;
  adduser.value = "新增用户";
  sonclear.value.imgurl = "";
};

// 关闭弹框
const distancecancel = (close: any) => {
  addusershow.value = close;
};

// 删除角色
const delets = () => {
  ElMessageBox.confirm("确认删除吗？", "温馨提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning"
  }).then(() => {
    const data = {
      iShunXu: iShunXu.value,
      strJuSeId: JueSeID.value,
      strJuSeName: bjjuese.value
    };
    PostJueSeDeleteport(data).then((res: any) => {
      console.log(res);
      pdone.value = null;

      if (res.Success == 0) {
        ElMessage({
          type: "success",
          message: "删除成功"
        });
        order();
      }
    });
  });
};

// 新增角色
const addrole = () => {
  ElMessageBox.prompt("", "新增角色", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    inputPattern: /^\S+$/,
    inputErrorMessage: "不能为空或者包含空格"
  }).then(({ value }) => {
    pdone.value = 2;
    centerDialogVisible.value = false;
    const data = {
      iShunXu: 0,
      strJuSeId: "",
      strJuSeName: value
    };
    console.log(JueSeID.value);
    PostJueSeAddport(data).then((res: any) => {
      console.log(res);
      if (res.Success == 0) {
        HuiXianlist.value = [];
        ElMessage({
          type: "success",
          message: "添加成功"
        });
        order();
        nextTick(() => {
          centerDialogVisible.value = true;
        });
      } else {
        pdone.value = 1;
        nextTick(() => {
          centerDialogVisible.value = true;
        });
      }
    });
  });
};

// 编辑角色
const modification = () => {
  ElMessageBox.prompt("", "新增角色", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    inputPattern: /^\S+$/,
    inputErrorMessage: "不能为空或者包含空格",
    inputValue: bjjuese.value
  }).then(({ value }) => {
    pdone.value = 2;
    centerDialogVisible.value = false;
    const data = {
      iShunXu: 0,
      strJuSeId: JueSeID.value,
      strJuSeName: value
    };
    console.log(JueSeID.value);
    PostJueSeUpdateport(data).then((res: any) => {
      console.log(res);
      if (res.Success == 0) {
        ElMessage({
          type: "success",
          message: "编辑成功"
        });
        bjjuese.value = res.Data.JueSeName;
        order();
        nextTick(() => {
          centerDialogVisible.value = true;
        });
      } else {
        pdone.value = 1;
      }
    });
  });
};

// 查询个人
const serchoneuser = () => {
  const data = {
    strUser: searchoneuser.value
  };
  GetSelUserport(data).then((res: any) => {
    console.log(res);
    res.Data.forEach((item: any) => {
      if (!specificuser.value.some(existingItem => existingItem.UserID === item.UserID)) {
        // 如果不存在，则追加
        specificuser.value.push(item);
      }
    });
  });
};
// UserID

// 角色保存权限
const savejurisdiction = () => {
  console.log(1);
  const data = {
    strType: defaultpermission.value,
    strJueSeId: JueSeID.value,
    listQuanXianId: alasArray.value
  };
  PostSaveJuSeQuanXianport(data).then((res: any) => {
    console.log(res);
    if (res.Success == 0) {
      ElMessage({
        type: "success",
        message: "保存成功"
      });
    }
  });
};

// 保存个人权限
const savepersonagejurisdiction = () => {
  const jurisdictionsole = ref<any>([]);
  if (specificuser.value.length != 0) {
    specificuser.value.forEach((item: any) => {
      jurisdictionsole.value.push(item.uCode);
    });
  } else {
    return ElMessage.error("请先选择人员");
  }
  if (alasArray.value.length == 0) {
    return ElMessage.error("选择要添加的权限");
  }
  operate.value = "追加";
  const data = {
    strType: defaultpermission.value,
    strLeiBie: operate.value,
    listUcode: jurisdictionsole.value,
    listQuanXianId: alasArray.value
  };
  PostUserZhuiJiaQuanXianport(data).then((res: any) => {
    console.log(res);
    if (res.Success == 0) {
      centerDialogVisible.value = false;
      defaultpermission.value = "院区权限";
      alasArray.value = [];
      HuiXianlist.value = [];
      atpresentjurisdiction.value = GetSelQuanXian.value.listCaiDanQuanXianDataClass;
      ElMessage({
        type: "success",
        message: "保存成功"
      });
      nextTick(() => {
        centerDialogVisible.value = true;
      });
    }
  });
};

// 删除个人权限
const deletepersonagejurisdiction = () => {
  const jurisdictionsole = ref<any>([]);
  if (specificuser.value.length != 0) {
    specificuser.value.forEach((item: any) => {
      jurisdictionsole.value.push(item.uCode);
    });
  } else {
    return ElMessage.error("请先选择人员");
  }
  if (alasArray.value.length == 0) {
    return ElMessage.error("选择要添加的权限");
  }
  operate.value = "删除";
  const data = {
    strType: defaultpermission.value,
    strLeiBie: operate.value,
    listUcode: jurisdictionsole.value,
    listQuanXianId: alasArray.value
  };
  PostUserZhuiJiaQuanXianport(data).then((res: any) => {
    console.log(res);
    if (res.Success == 0) {
      centerDialogVisible.value = false;
      defaultpermission.value = "院区权限";
      alasArray.value = [];
      HuiXianlist.value = [];
      atpresentjurisdiction.value = GetSelQuanXian.value.listCaiDanQuanXianDataClass;
      ElMessage({
        type: "success",
        message: "删除成功"
      });
      nextTick(() => {
        centerDialogVisible.value = true;
      });
    }
  });
};

// 移出人员
const removeuser = (row: any) => {
  console.log(row);

  const filteredData = specificuser.value.filter((item: any) => {
    // 根据具体业务逻辑判断是否包含相同数据，这里假设判断条件为 UserID 相等
    return item.UserID !== row.UserID;
  });
  specificuser.value = filteredData;
};

const unify = () => {
  pdone.value = null;
  defaultpermission.value = "院区权限";
  searchoneuser.value = "";
  HuiXianlist.value = [];
  alasArray.value = [];
  cutpage.value = false;
  specificuser.value = [];
  immediately();
};

const specific = () => {
  GetSelYongHu.value.listBaoBiao = [];
  GetSelYongHu.value.listCaiDan = [];
  GetSelYongHu.value.listShenQingDan = [];
  GetSelYongHu.value.listYuanQu = [];
  alasArray.value = [];
  centerDialogVisible.value = false;
  atpresentjurisdiction.value = GetSelQuanXian.value.listYuanQuClass;
  HuiXianlist.value = [];
  defaultpermission.value = "院区权限";
  JueSeID.value = "";

  nextTick(() => {
    centerDialogVisible.value = true;
  });
  cutpage.value = true;
};

// 解除锁定
const unlocks = async (params: any) => {
  console.log(params);
  const data = {
    struCode: params.uCode,
    strJuseId: params.JueSeID,
    iShunXu: params.ShunXu
  };
  await useHandleData(PutJieChuSuoDingport, data, `解锁成功`);
  proTable.value?.getTableList();
};

// 删除用户信息
const deleteAccount = async (params: any) => {
  ElMessageBox.confirm("确认删除吗？", "温馨提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning"
  }).then(() => {
    pdone.value = 2;
    const data = {
      struCode: params.uCode,
      strJuseId: params.JueSeID,
      iShunXu: params.ShunXu
    };
    DeleteUserDeleteport(data).then((res: any) => {
      console.log(res);
      if (res.Success == 0) {
        ElMessage({
          type: "success",
          message: "删除成功"
        });
        order();
      } else {
        pdone.value = 1;
      }
    });
  });
};
// 批量添加用户
const dialogRef = ref<InstanceType<typeof ImportExcel> | null>(null);

// 打开 drawer(新增、查看、编辑)
const drawerRef = ref<InstanceType<typeof UserDrawer> | null>(null);
</script>

<style lang="scss">
.unify {
  cursor: pointer;
  b {
    // color: #42b1a6;
    // border-bottom: 2px #42b1a6 solid;
    padding-bottom: 19px;
    margin-top: -2px;
    margin-left: 20px;
  }
}
.area-search {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  height: 8%;
  overflow-x: hidden;
  background-color: var(--el-bg-color);
  border: 1px solid var(--el-border-color-light);
  border-radius: 6px;
  box-shadow: 0 0 12px rgb(0 0 0 / 5%);
}
.table-boxs {
  width: calc(100% - 560px);
  background-color: red;
}
.scrollbar-demo-item {
  padding-left: 20px;
  cursor: pointer;
}
.highlight {
  padding: 5px 5px 5px 20px;
  padding-left: 20px;
  color: white;
  background-color: #009688;
}
.operation {
  position: absolute;
  bottom: 0;
  display: flex;
  width: 100%;
  padding-top: 10px;
  text-align: center;
  background: white;
  div {
    padding: 4px 6px;
    font-size: 15px;
    border-radius: 4px;
  }
}
.operation div:nth-child(1) {
  color: white;
  cursor: pointer;
  background-color: #009688;
}
.operation div:nth-child(2) {
  color: #d0b83c;
  cursor: pointer;
  background-color: #fff4bc;
  border: #ffd500 1px solid;
}
.operation div:nth-child(3) {
  color: red;
  cursor: pointer;
  background-color: #fef0f0;
  border: red 1px solid;
}
.jurisdiction {
  box-sizing: border-box;
  width: 330px;
  padding: 20px;
  margin-left: 10px;
  overflow-x: hidden;
  background-color: white;
  background-color: var(--el-bg-color);
  border: 1px solid var(--el-border-color-light);
  border-radius: 6px;
  box-shadow: 0 0 12px rgb(0 0 0 / 5%);
  .jurisdictionhead {
    height: 10%;
  }
  .jurisdictionbody {
    height: 80%;
    overflow-y: auto; /* 仅在溢出时显示滚动条 */
  }
  .jurisdictionleg {
    display: flex;
    align-items: center;
    height: 10%;
  }
}
</style>
